<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>9.解构默认值实现配置项合并</title>
</head>

<body>
  <script>
    // 数组第二个元素本不存在，可以设置默认值
    let [name, site = 'hdcms'] = ['后盾人'];
    console.log(site); //hdcms
    // 同理，对象也可以这样做，为不存在的参数设置默认值
    let { name2, url, user = '向军大叔' } = { name2: '后盾人', url: 'houdunren.com' };
    console.log(name2, user);//向军大叔

    //使用默认值特性可以方便的进行参数合并
    function createElement(options) {
      let {
        width = '200px',
        height = '100px',
        backgroundColor = 'red'
      } = options;
      console.log(width, height, backgroundColor);
      let div = document.createElement('div');
      div.style.width = width;
      div.style.height = height;
      div.style.backgroundColor = backgroundColor;
      document.body.appendChild(div);
    };
    createElement({
     // width:'30px',
     // height: '50px',
      backgroundColor: 'green'
    });
  </script>
</body>

</html>